<!--
  -- Copyright 2016 The Chromium Authors. All rights reserved.
  -- Use of this source code is governed by a BSD-style license that can be
  -- found in the LICENSE file.
  -->

<link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
<link rel="import" href="chrome://resources/polymer/v1_0/font-roboto/roboto.html">

<dom-module id="track-info-panel">
  <link rel="import" type="css" href="track_info_panel.css">
  <template>
    <div class="track-wrapper">
      <div class="icon-unavailable-expanded"></div>
      <div class="icon-expanded" style="background-image: url([[track.artworkUrl]]);"></div>
      <div class="track">
        <div class="icon-wrapper">
          <div class="icon" style="background-image: url([[track.artworkUrl]]);"></div>
        </div>
        <div class="data">
          <div class="data-title">[[track.title]]</div>
          <div class="data-artist">[[track.artist]]</div>
        </div>
        <paper-button toggles
            id="expand"
            class="expand"
            active="{{expanded}}">
        </paper-button>
      </div>
    </div>
  </template>
</dom-module>

<script src="track_info_panel.js"></script>
